<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>查看数据</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../assets/libs/layui/css/layui.css" media="all">
</head>

<body>

    <form class="layui-form" lay-filter="example">

        <div class="layui-form-item" style="margin-top: 20px">
            <label class="layui-form-label">菜谱编号:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuId" disabled="true" autocomplete="off" id="menuId" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item" style="margin-top: 20px">
            <label class="layui-form-label">菜谱名称:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuName" lay-verify="title" autocomplete="off" disabled="true" id="menuName"
                    class="layui-input">
            </div>
        </div>

        <div class="layui-form-item" style="margin-top: 20px">
            <label class="layui-form-label">辣度属性:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuFlavor" lay-verify="title" autocomplete="off" disabled="true"
                    id="menuFlavor" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="margin-top: 20px">
            <label class="layui-form-label">菜谱标签:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuTag" lay-verify="title" autocomplete="off" disabled="true" id="menuTag"
                    class="layui-input">
            </div>
        </div>


        <div class="layui-form-item" style="margin-top: 20px">
            <label class="layui-form-label">就餐人数:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuPrice" lay-verify="title" autocomplete="off" disabled="true" id="menuPrice"
                    class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">菜谱简介:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuComm" lay-verify="required" disabled=" true" id="menuComm"
                    autocomplete="off" class="layui-input">
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">菜谱图片:</label>
            <div class="layui-input-block" style="margin-right: 20px" id="menuImgList"></div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">菜谱类型:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuType" lay-verify="required" disabled=" true" id="menuType"
                    autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">菜谱热量:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuHot" lay-verify="required" disabled=" true" id="menuHot" autocomplete="off"
                    class="layui-input">
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">菜谱时区:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuTime" lay-verify="required" disabled=" true" id="menuTime"
                    autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">发布时间:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <input type="text" name="menuDate" lay-verify="required" disabled=" true" id="menuDate"
                    autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">菜谱步骤:</label>
            <div class="layui-input-block" style="margin-right: 20px">
                <div type="text" name="menuMaterials" class="layui-input" style="border: none;margin-top: 20px;"
                    id="menuMaterials"></div>
            </div>
        </div>
    </form>

    <style>
        #menuImgList img {
            margin: 5px;
        }
    </style>
    <script src="../../assets/libs/layui/layui.js" charset="utf-8"></script>
    <script src="../js/util.js" charset="utf-8"></script>
    <script>

        layui.config({
            base: '/module/'
        }).use(['jquery', 'layer', 'table', 'form', 'config'], function () {
            var $ = layui.jquery;
            var layer = layui.layer;
            var table = layui.table;
            var form = layui.form;
            var config = layui.config;
            var req = GetRequest();

            var no = req['editNo'];//获取请求的url参数editNo的值
            //获取当前编辑的数据
            $.ajax({
                url: config.base_server + 'getMenuById?editNo=' + no,
                dataType: 'json',
                type: 'get',
                success: function (data) {
                    data = data.data;
                    $('#menuId').val(data.menuId);
                    $('#menuName').val(data.menuName);
                    $('#menuPrice').val(data.menuPrice);
                    $('#menuTag').val(data.menuTag);
                    (data.menuImgList).forEach(item => {
                        $('#menuImgList').append('<img  src="' + item + '" alt="" srcset="" disabled="true" name="menuImg" id="menuImg" width="100" height="100" />');
                    })
                    $('#menuComm').val(data.menuComm);
                    $('#menuType').val(data.menuType);
                    $('#menuHot').val(data.menuHot);

                    $('#menuFlavor').val(data.menuFlavor);
                    $('#menuTime').val(data.menuTime)
                    $('#menuMaterials').html(data.menuMaterials)
                    $('#menuDate').val(data.menuDate)
                }
            })
        });
    </script>


</body>